import * as Assets from '../assets';

export default class Menu extends Phaser.State {
    private backgroundTemplateSprite: Phaser.Sprite = null;
    private googleFontText: Phaser.Text = null;
    private localFontText: Phaser.Text = null;
    private pixelateShader: Phaser.Filter = null;
    private bitmapFontText: Phaser.BitmapText = null;
    private blurXFilter: Phaser.Filter.BlurX = null;
    private blurYFilter: Phaser.Filter.BlurY = null;
    private sfxAudiosprite: Phaser.AudioSprite = null;
    private mummySpritesheet: Phaser.Sprite = null;

    private snowmanSpritesheet: Phaser.Sprite = null;

    // This is any[] not string[] due to a limitation in TypeScript at the moment;
    // despite string enums working just fine, they are not officially supported so we trick the compiler into letting us do it anyway.
    private sfxLaserSounds: any[] = null;

    public create(): void {
        this.backgroundTemplateSprite = this.game.add.sprite(
            this.game.world.centerX,
            this.game.world.centerY,
            Assets.Images.SpritesheetsDeepblue.getName(),
        );
        this.backgroundTemplateSprite.anchor.setTo(0.5);

        this.game.sound.play(Assets.Audio.AudioTimeTravel.getName(), 0.6, true);

        // this.googleFontText = this.game.add.text(
        //     this.game.world.centerX,
        //     this.game.world.centerY - 100,
        //     'Google Web Fonts',
        //     {
        //         font: '50px ' + Assets.GoogleWebFonts.Barrio,
        //     }
        // );
        // this.googleFontText.anchor.setTo(0.5);

        // this.localFontText = this.game.add.text(
        //     this.game.world.centerX,
        //     this.game.world.centerY,
        //     'Local Fonts + Shaders .frag (Pixelate here)!',
        //     {
        //         font: '30px ' + Assets.CustomWebFonts.Fonts2DumbWebfont.getFamily()
        //     }
        // );
        // this.localFontText.anchor.setTo(0.5);

        // this.pixelateShader = new Phaser.Filter(
        //     this.game, null,
        //     this.game.cache.getShader(Assets.Shaders.ShadersPixelate.getName())
        // );
        // this.localFontText.filters = [this.pixelateShader];

        // this.bitmapFontText = this.game.add.bitmapText(
        //     this.game.world.centerX,
        //     this.game.world.centerY + 100,
        //     Assets.BitmapFonts.FontsFontFnt.getName(),
        //     'Bitmap Fonts + Filters .js (Blur here)!', 40,
        // );
        // this.bitmapFontText.anchor.setTo(0.5);

        // this.blurXFilter = this.game.add.filter(Assets.Scripts.ScriptsBlurX.getName()) as Phaser.Filter.BlurX;
        // this.blurXFilter.blur = 8;
        // this.blurYFilter = this.game.add.filter(Assets.Scripts.ScriptsBlurY.getName()) as Phaser.Filter.BlurY;
        // this.blurYFilter.blur = 2;

        // this.bitmapFontText.filters = [this.blurXFilter, this.blurYFilter];

        // this.mummySpritesheet = this.game.add.sprite(
        //     this.game.world.centerX,
        //     this.game.world.centerY + 175,
        //     Assets.Spritesheets.SpritesheetsMetalslugMummy374518.getName()
        // );
        // this.mummySpritesheet.animations.add('walk');
        // this.mummySpritesheet.animations.play('walk', 30, true);

        // 显示雪人
        this.showSnowman();
        // 开始按钮
        const startBtn: Phaser.Button = this.game.add.button(this.game.world.centerX, this.game.world.centerY + 60, Assets.Spritesheets.SpritesheetsStart4011433.getName(), this.actionOnClick, this, 0, 1, 2);
        startBtn.anchor.set(0.5, 0.5);
        // 显示文字
        this.showText('我的大冒险');

        this.sfxAudiosprite = this.game.add.audioSprite(Assets.Audiosprites.AudiospritesSfx.getName());

        // This is an example of how you can lessen the verbosity
        let availableSFX = Assets.Audiosprites.AudiospritesSfx.Sprites;
        this.sfxLaserSounds = [
            availableSFX.Laser1,
            availableSFX.Laser2,
            availableSFX.Laser3,
            availableSFX.Laser4,
            availableSFX.Laser5,
            availableSFX.Laser6,
            availableSFX.Laser7,
            availableSFX.Laser8,
            availableSFX.Laser9
        ];

        // this.game.sound.play(Assets.Audio.AudioMusic.getName(), 0.2, true);

        this.backgroundTemplateSprite.inputEnabled = true;
        this.backgroundTemplateSprite.events.onInputDown.add(() => {
            this.sfxAudiosprite.play(Phaser.ArrayUtils.getRandomItem(this.sfxLaserSounds));
        });

        this.game.camera.flash(0x000000, 600);
    }

    actionOnClick() {
        const downTween: Phaser.Tween = this.game.add.tween(this.snowmanSpritesheet).to({y: this.game.world.height + 100}, 800, Phaser.Easing.Cubic.In, true);
        downTween.onComplete.addOnce(() => {
            this.endMainmenu();
        });
    }
    endMainmenu() {
        this.game.state.clearCurrentState();
        this.game.state.start('intro');
    }
    showSnowman() {
        this.snowmanSpritesheet = this.game.add.sprite(-10, this.game.world.height, Assets.Spritesheets.SpritesheetsSnowman1037812.getName());
        this.snowmanSpritesheet.position.setTo(-100, this.game.world.height);
        this.game.add.tween(this.snowmanSpritesheet).to({x: -10}, 1500, Phaser.Easing.Bounce.Out, true);

        this.snowmanSpritesheet.anchor.setTo(0, 1);
        this.snowmanSpritesheet.animations.add('idle', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], 10, true);
        this.snowmanSpritesheet.animations.play('idle');
    }
    showText(text) {
        const bar: Phaser.Graphics = this.game.add.graphics();
        bar.beginFill(0x000000, 0.2);
        bar.drawRect(0, 100, 800, 100);

        const style = { font: 'bold 32px Simhei', fill: '#fff', boundsAlignH: 'center', boundsAlignV: 'middle' };

        // The Text is positioned at 0, 100
        const gameTitle: Phaser.Text = this.game.add.text(0, 0, text, style);
        gameTitle.setShadow(3, 3, 'rgba(0,0,0,0.5)', 2);

        // We'll set the bounds to be from x0, y100 and be 800px wide by 100px high
        gameTitle.setTextBounds(0, 100, 800, 100);
    }
}
